<script lang="ts" setup>
// 1. 原始方式
// defineProps({
//   money: {
//     type: Number,
//     required: true,
//   },

// car: {
//     type: Number,
//     default: '自行车',
//   },
// })

// 2. ts方式
// defineProps<子组件接受数据的类型>()

const { money, car = '自行车' } = defineProps<{
  money: number
  car?: string
}>()
// 1. 原始方式
// const emit = defineEmits(['payMoney', 'getMoney'])

// 2. ts方式实现字传父  defineEmits<将来你触发的自定义事件函数的类型>()
const emit = defineEmits<{
  (e: 'payMoney', value: number): void
  (e: 'getMoney', value: number): void
}>()
// 挣钱事件函数
const pay = () => {
  emit('payMoney', 10)
}
// 花钱事件函数
const get = () => {
  emit('getMoney', 100)
}
</script>

<template>
  <div>son组件 -- {{ money }} -- {{ car }}</div>
  <button @click="pay">花钱</button>
  <button @click="get">挣钱</button>
</template>

<style>
button {
  margin-right: 10px;
}
</style>
